<template>
<div id="app">
  <div class="filter-container">
        <el-form :inline="true" class="demo-form-inline">
    <el-form-item label="评论编码">
    <el-input  placeholder="评论编码" v-model="commentCode"></el-input>
  </el-form-item>
<el-form-item label="帖子编码">
    <el-input  placeholder="帖子编码" v-model="inviteCode"></el-input>
  </el-form-item>
  <el-form-item>
    <el-button type="primary" icon="el-icon-search" @click="searchs">查询</el-button>
  </el-form-item>
</el-form>
  </div>

  <div class="header">
      <!--数据展现table-->
<el-table
    :data="tableData"
    style="width: 100%;margin-bottom: 20px;"
    row-key="nodeid"
    border
    default-expand-all
    :tree-props="{children: 'children', hasChildren: 'hasChildren'}">
    <el-table-column
     align="center"
      prop="attribute.commentCode"
      label="评论编码">
    </el-table-column>
    <el-table-column
      prop="attribute.bytime"
      align="center"
      label="评论时间"
     >
    </el-table-column>
    <el-table-column
      prop="attribute.userName"
      align="center"
      label="评论人名称"
     >
    </el-table-column>
    <el-table-column
      prop="attribute.inviteCode"
      align="center"
      label="评论帖子的编码"
     >
    <template>
    
    </template>
    </el-table-column>
     <el-table-column
     align="center"
      prop="attribute.commentText"
      label="内容">
    </el-table-column>

    <el-table-column align="center" label="操作"  width="80">
            <template slot-scope="scope">
                <el-button type="danger" size="mini"  @click="del(scope.row)" >删除</el-button>
            </template>
    </el-table-column>
  </el-table>
   
  </div>
</div>
</template>
<script>
import { getAllsee,deleteComment } from "../../api/pinglun";
  export default {
    data() {
      return {
        activeNames: ['1'],
        index:'',
        pageNum: 1, // 页数
        pageSize: 7, // 每页大小
        dataSize: 0, // 总条数
        tableData: [],
        commentCode:'',
        inviteCode:''
      };
    },
    mounted(){
      this.getData()
    },
    methods: {
      getData(){
        let obj={
          commentCode:this.commentCode,
          inviteCode:this.inviteCode
        }
    getAllsee(obj).then(response => {     
        if(response.data.responseCode===200){
          this.tableData=response.data.data
           this.$message({
          message: '恭喜你，这是一条成功消息',
          type: 'success'
        });
        }
        }).catch(error=>{
      this.$message({
          message: '查询失败！',
          type: 'error'
        });
        })
      },
      del(val){      
        // console.log(val);
         this.$confirm("此操作将永久删除该数据, 是否继续?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
          .then(() => {
            //  deleteInvite
            let obj={
  "replyId": val.attribute.commentCode,
  "inviteCode": val.attribute.inviteCode
        }
              deleteComment(obj).then(response => {     
                if(response.data.responseCode===200){
                this.getData()
          this.$message({
            type: 'success',
            message: '删除成功!'
          });
                }else{
            this.$message({
              type: "error",
              message: "删除失败！存在子评论"
            });
                }
              }).catch(error=>{
                  this.$message({
              type: "error",
              message: "删除失败！"
            });
              })
          })
          .catch(() => {
            this.$message({
              type: "info",
              message: "已取消删除"
            });
          });

      },
      searchs(){
        console.log("====");
        this.getData()
      },
      handleChange(val) {
        console.log(val);
      },
       handleSizeChange(val){
        this.pageSize = val
      },
      // 第几页
      handleCurrentChange(val){
        this.pageNo = val
      },
    }
  }
</script>
<style scoped>
.pagination {
  margin-top: 10px;
  text-align: right;
}
.filter-container {
  margin-top: 20px;
  float: right;
  margin-bottom: 20px
}
.filter-item {
  margin-left: 5px;
}
</style>